.masterlist {
    min-height: 600px;

    .share-header {
        padding      : 20px 0;
        background   : #409EFF;
        color        : #fff;
        margin-bottom: 20px;

        .user_box {
            min-width    : 150px;
            border-radius: 10px;
            padding      : 10px;
            box-sizing   : border-box;
            margin-right : 20px;
            background   : rgba(255, 255, 255, 0.5);
        }

        .share-header-title {
            font-size    : 36px;
            margin-bottom: 5px;
        }

        .look_btn {
            // font-size: 16px;
            margin-top  : 20px;
        }

        .href_rule {
            font-size : 14px;
            margin-top: 10px;

            a {
                color    : #fff;
                font-size: 14px;

                // display: block;
            }
        }
    }

    .center_box {
        .center_box_left {
            width      : 33%;
            max-width  : 450px;
            padding    : 10px;
            padding-top: 40px;
            box-sizing : border-box;

            .tabs_box {
                margin-top: 10px;

                .type_list {
                    overflow  : hidden;
                    width     : 100%;
                    margin    : 0 auto;
                    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
                    overflow-x: auto;

                    .fist_type {
                        overflow-x : auto;
                        overflow-y : hidden;
                        white-space: nowrap;
                        width      : 100%;

                        .fist_type_item {
                            display    : inline-block;
                            font-size  : 14px;
                            // width   : 100px;
                            padding    : 4px 10px;
                            line-height: 20px;
                            box-sizing : border-box;
                            cursor     : pointer;
                        }

                    }
                }

                .purchase_box {
                    padding   : 10px;
                    box-sizing: border-box;
                    font-size : 14px;

                    .purchase_item {
                        border-top      : 1px solid #ddd;
                        border-bottom   : 1px solid #ddd;
                        padding         : 10px;
                        box-sizing      : border-box;
                        // margin-bottom: 15px;

                        .purchase_item_box {
                            // margin-bottom: 20px;
                            border-radius   : 5px;
                            overflow        : hidden;
                            margin          : 10px 0;

                            .item_header {
                                background: #409EFF;
                                color     : #fff;
                                padding   : 5px;
                                box-sizing: border-box;
                            }

                            .t_item_p {
                                padding      : 6px;
                                box-sizing   : border-box;
                                border-bottom: 1px solid #f5f5f5;
                                position     : relative;
                                overflow     : hidden;

                                .t_item {
                                    height     : 100%;
                                    margin     : 4px 0;
                                    line-height: 18px;
                                }

                                .t_item_cost_amount {
                                    position: relative;

                                    .state_box {
                                        width        : 30px;
                                        height       : 30px;
                                        text-align   : center;
                                        border-radius: 50%;
                                        font-size    : 10px;
                                        line-height  : 30px;
                                        position     : absolute;
                                        left         : 68%;
                                        top          : 4px;
                                        color        : #fff;
                                        // padding   : 4px;
                                        border-style : solid;
                                        border-width : 1px;
                                        opacity      : 0.4;
                                        z-index      : 3;
                                        font-weight  : bolder;
                                        box-sizing   : border-box;
                                        transform    : rotate(40deg) translate(-50%, 0);
                                    }
                                }
                            }

                        }

                        .total {
                            // position: relative;
                            font-size  : 14px;
                            color      : #409EFF;
                            font-weight: bolder;
                        }
                    }
                }

                .fans_item {
                    // margin: 8px 0;
                }
            }
        }

        .level_icon_1 {
            width       : 17px;
            height      : 15px;
            margin-right: 5px;
        }

        .user_info_item {
            width    : 100%;
            font-size: 14px;

            .user_name {
                margin-left: 10px;
                font-size  : 10px;

                div {
                    line-height: 22px;
                }
            }

            .dianzan {
                line-height : 40px;
                margin-right: 40px;

                .zan_icon {
                    width       : 15px;
                    height      : 17px;
                    cursor      : pointer;
                    margin-right: 6px;
                }
            }

            .grade_box_rankA {
                width     : calc(100%/3.5);
                text-align: center;

                div {
                    width      : 100%;
                    line-height: 18px;
                }
            }
        }
    }

    .type {

        // text-align: left;
        .type_item_box {
            margin: 15px 0;

            .type_item {
                margin-left: 10px;
            }
        }
    }

    .status_box {
        margin      : 0 10px;
        border-right: 1px solid #ddd;

        span {
            color: #F56C6C;
        }
    }

    .status_box:last-child {
        border: 0;
    }

    .list_box {
        margin-top: 60px;

        .item_left {
            margin-right: 60px;
        }

        .view_box {
            // margin   : 10px;
            margin-right: 10px;
        }

        .user_icon {
            width       : 50px;
            height      : 50px;
            margin-right: 10px;
        }

        .level_icon {
            width       : 22px;
            height      : 18px;
            margin-right: 5px;
        }

        .nickname {
            margin-right: 10px;
        }

        .record {
            color      : #F56C6C;
            line-height: 30px;
            text-align : left;
            margin     : 5px 0;
        }

        .max {
            display     : inline;
            margin-right: 20px;
            display     : inline-block;
            margin-right: 20px;
            max-width   : 500px;
            text-align  : left;
            word-break  : break-all;
        }
    }

    .right_drawer {}

    .lable_item {
        padding      : 15px 5px;
        box-sizing   : border-box;
        border-bottom: 1px solid #ccc;

        span {
            color: #F56C6C;
        }
    }

    .round_box {
        padding-bottom: 10px;
        margin-bottom : 20px;
        border-bottom : 1px solid #ccc;

        .round {
            display      : block;
            width        : 22px;
            height       : 22px;
            text-align   : center;
            line-height  : 22px;
            border-radius: 50%;
            margin       : 5px;
            cursor       : pointer;
            box-sizing   : border-box;
        }

        .round_border {
            border: 1px solid #F56C6C;
        }

        .round_bg {
            color     : #fff;
            background: #F56C6C;
        }
    }

    .dialog_content {

        .record,
        .contest,
        .updated_at {
            margin   : 10px 0;
            min-width: 10px;
        }

        .contest {
            color: #E6A23C;
        }

        .limit {
            margin   : 10px 0;
            font-size: 12px;
            color    : #67C23A;
        }
    }

    .explain_box {
        margin-top : 10px;
        border-top : 1px solid #ddd;
        padding-top: 10px;
    }

    .explain {
        font-size  : 10px;
        white-space: pre-wrap;
        line-height: 20px;
        text-align : left;
        color      : #F56C6C;
    }

    .dispatch_ball {
        .dispatch_item {
            cursor          : pointer;
            // width        : 50px;
            width           : calc(100%/8);
            display         : inline-block;
            padding         : 4px 0;
            box-sizing      : border-box;
            border          : 1px solid #409EFF;
            border-radius   : 5px;
            margin          : 5px 3px;
            text-align      : center;
            font-size       : 12px;
        }

        .dispatch_item_select {
            color     : #fff;
            background: #409EFF;
        }

        .dispatch_item_default {
            color     : #409EFF;
            background: #fff;
        }
    }

}